<template>
	<view class="container">
		<view class="topContainer">
			<view class="imgContainer">
				<image :src="headImg" class="headImg"></image>
				<!-- <image :src="headImg" class="headImg" @click="changeImg()"></image> -->
				<!-- <image src="../../static/icon/camera.png" class="camera" @click="changeImg()"></image> -->
			</view>
		</view>
		
		<view class="body">
			<block v-for="(item,index) in userInfoList" :key="index">
				<view class="infoContainer" @click="editInfo(item.id,item.content,item.title)">
					<view class="title">
						{{item.title}}
					</view>
					<view class="contentContainer">
						<view class="content">{{item.content}}</view>
					</view>
					<view class="rightHead">
						<view class="lg text-gray cuIcon-right , infoImg"></view>
					</view>
				</view>
			</block>
		</view>
		
	</view>
</template>

<script>
	import * as api from '../config/api.js'
	import { headImg } from '../../data/data.js'
	export default {
		data(){
			return{
				userInfoList:[],
				headImg:headImg
			}
		},
		onShow() {
			this.updateSessionUser();
		},
		onLoad() {
			this.updateSessionUser();
			this.setHeadImg();
			this.sessionGetUser();
		},
		methods:{
			setHeadImg(){
				let sessionHeadImg = uni.getStorageSync('headImg');
				if(sessionHeadImg != ''){
					this.headImg = sessionHeadImg
				}else{
					this.headImg = headImg
				}
			},
			sessionGetUser(){
				let user = uni.getStorageSync('leaveUser')
				let userInfo = [
					{
						"id":1,
						"title":"昵称",
						"content":user.leaveUserNickName
					},{
						"id":2,
						"title":"姓名",
						"content":user.leaveUserName
					},{
						"id":3,
						"title":"性别",
						"content":user.leaveUserSex
					},{
						"id":4,
						"title":"学校",
						"content":user.universityName
					},{
						"id":5,
						"title":"院系",
						"content":user.facultyName
					},{
						"id":6,
						"title":"班级",
						"content":user.clbumName
					},{
						"id":7,
						"title":"学号",
						"content":user.leaveUserNum
					},{
						"id":8,
						"title":"地区",
						"content":user.leaveUserAddr
					},
				]
				this.userInfoList = userInfo
			},
			updateSessionUser(){
				let leaveUserNum = uni.getStorageSync('leaveUserNum')
				let that = this;
				api.getUserByIdApi(leaveUserNum,{
					data:{},
					success:res=>{
						// console.log(res)
						let user = res.data
						let userInfo = [
							{
								"id":1,
								"title":"昵称",
								"content":user.leaveUserNickName
							},{
								"id":2,
								"title":"姓名",
								"content":user.leaveUserName
							},{
								"id":3,
								"title":"性别",
								"content":user.leaveUserSex
							},{
								"id":4,
								"title":"学校",
								"content":user.universityName
							},{
								"id":5,
								"title":"院系",
								"content":user.facultyName
							},{
								"id":6,
								"title":"班级",
								"content":user.clbumName
							},{
								"id":7,
								"title":"学号",
								"content":user.leaveUserNum
							},{
								"id":8,
								"title":"地区",
								"content":user.leaveUserAddr
							},
						]
						this.userInfoList = userInfo
					},
					fail:err=>{
						uni.showToast({
							title:"网络延迟",
							icon:"none"
						})
					}
				})
			},
			// changeImg(){
			// 	const _this = this;
			// 	uni.showActionSheet({
			// 		itemList: ['相册', '拍照'],
			// 		success: (res) => {
			// 			if (res.tapIndex == 0) {
			// 				// 用户点击了从图库上传
			// 				// console.log("相册")
			// 				uni.chooseImage({
			// 					count: 1,
			// 					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
			// 					sourceType: ['album'], //从相册选择
			// 					success: (res) => {
			// 						this.pushPhotoToService(res.tempFilePaths[0])
			// 					}
			// 				})
			// 			} else {
			// 				// console.log("照相")
			// 				uni.chooseImage({
			// 					count: 1,
			// 					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
			// 					sourceType: ['camera'], //从摄像头选择
			// 					success: (res) => {
			// 						this.pushPhotoToService(res.tempFilePaths[0])
			// 					}
			// 				})
			// 			};
			// 		},
			// 		fail: (res) => {
			// 			console.log(res.errMsg);
			// 		}
			// 	});
			// },
			// async pushPhotoToService(value) { //图片上传到服务器
			// 	let that = this;
			// 	uni.uploadFile({
			// 		url: '七牛云的地址，如果有的话',
			// 		filePath: value,
			// 		name: 'file',
			// 		success: (res) => {
			// 			let info = JSON.parse(res.data)
			// 			console.log(info)
			// 			if(info.status == 0){
			// 				// 获取图片地址
			// 				let imgUrl = info.data.imgUrl
			// 				// console.log(imgUrl)
			// 				uni.setStorageSync('headImg',imgUrl)
			// 				that.headImg = imgUrl
			// 			}else{
			// 				uni.showToast({
			// 					title:"修改头像失败",
			// 					icon:"none"
			// 				})
			// 			}
			// 		},
			// 		fail:(err)=>{
			// 			uni.showToast({
			// 				title:"修改头像失败",
			// 				icon:"none"
			// 			})
			// 		}
			// 	});
			// },
			// async updatePhoto(photo) { //修改数据库图片
			// 	// console.log(photo)
			// 	try {
			// 		const value = uni.getStorageSync('WD_TOKEN').WD_TOKEN;
			// 		// console.log(value)
			// 		if (value.WD_TOKEN !== null) {
			// 			const updatePicture = await UpdatePicture({
			// 				uPhoto: photo,
			// 				token: value
			// 			})
			// 			if (updatePicture !== null) {
			// 				uni.showToast({
			// 					title: "客官,头像修改成功了呢",
			// 					icon: "none"
			// 				})
			// 				uni.switchTab({
			// 					url: '../../navigator/mine',
			// 					success(res) {
			// 						console.log(res)
			// 					},
			// 					fail(err) {
			// 						console.log(err)
			// 					}
			// 				});
			// 			}
			// 			// console.log(updatePicture)
			// 		}
			// 	} catch (e) {
			// 		console.log(e)
			// 	}
			// },
			editInfo(id,content,title){
				switch(id){
					case 1:
						// console.log("修改昵称");
						uni.navigateTo({
							url:'/pages/component/updateUserInfo?id='+id+'&title='+title+'&content='+content
						})
						break;
					case 2:	
						uni.showToast({title:"姓名不可修改",icon:"none"})
						break;
					case 3:
						uni.showToast({title:"性别不可修改",icon:"none"})
						break;
					case 4:
						uni.showToast({title:"学校不可修改",icon:"none"})
						break;
					case 5:
						uni.showToast({title:"院系不可修改",icon:"none"})
						break;
					case 6:
						uni.showToast({title:"班级不可修改",icon:"none"})
						break;
					case 7:
						uni.showToast({title:"学号不可修改",icon:"none"})
						break;
					case 8:
						// console.log("修改地区");
						uni.navigateTo({
							url:'/pages/component/updateUserInfo?id='+id+'&title='+title+'&content='+content
						})
						break;
					default:
						break;
				}
			}
		}
	}
</script>

<style>
	page{
		width: 100%;
		height: 100%;
		background-color: white;
	}
	.container{
		width: 100%;
		height: 100%;
		padding-top: 50upx;
	}
	.topContainer{
		width: 100%;
	}
	.imgContainer{
		width: 200upx;
		height: 200upx;
		margin-left: auto;
		margin-right: auto;
	}
	.headImg{
		width: 200upx;
		height: 200upx;
		border-radius: 50%;
	}
	.camera{
		width: 70upx;
		height: 60upx;
		position: absolute;
		top: 205upx;
		margin-left: -60upx;
	}
	.body{
		margin-top: 60upx;
		width: 100%;
		height: 400upx;
	}
	.infoContainer{
		/* width: 100%; */
		width: 90%;
		margin-left: 5%;
		height: 100upx;
		/* padding: 20upx 40upx 30upx 40upx; */
		padding: 20upx 0upx 0upx 0upx;
		background-color: white;
		display: flex;
		border-bottom: 1px solid rgba(239,239,239,1);
	}
	.title{
		float: left;
		font-size: 35upx;
		font-weight: 600;
	}
	.contentContainer{
		position: right;
		text-align: right;
		position: absolute;
		height: 60upx;
		right: 100upx;
		line-height: 60upx;
	}
	.content{
		font-size: 33upx;
		font-weight:500;
		color: rgba(204,204,204,1);
	}
	.rightHead{
		text-align: right;
		position: absolute;
		width: 60upx;
		height: 60upx;
		right: 30upx;
		line-height: 60upx;
	}
	.infoImg{
		font-size: 40upx;
	}
</style>
